<template>
    <div class="recordPop">
        <p class="font-40 mb-60">请选择</p>
        <div class="recordPop-list">
            <ul class="list-menu">
                <li class="menu-content" v-for="item in list" :key="item.id" @click="selectMenu(item)">
                    <p class="font-36">{{ item.title }}</p>
                    <van-icon name="success" v-show="recordData.id === item.id"/>
                </li>
            </ul>
        </div>
    </div>
</template>

<script>
export default {
    props: {
        list: {
            type: Array,
            default: () => {},
        },
        recordData:{
            type:Object,
            default: () => {},
        }
    },
    methods: {
        selectMenu(data){
            this.$emit('selectMenu',data)
        }
    },
}
</script>

<style lang="scss" scoped>
.recordPop {
    .recordPop-list{
        .list-menu{
            display: flex;
            flex-direction: column;
            gap: 40px;
            .menu-content{
                display: flex;
                justify-content: space-between;
                align-items: center;
                .van-icon{
                    color: rgb(40, 152, 45);
                    font-size: 36px;
                }
            }
        }
    }
}
</style>